<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>学生管理系统</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="../js/vue.js"></script>
    <script src="../js/axios-0.18.0.js"></script>
    <link rel="stylesheet" href="../element-ui/lib/theme-chalk/index.css">
    <script src="../element-ui/lib/index.js"></script>
    <script src="../js/now-time.js"></script>
    <style>
        body {
            margin: 0;
            padding: 0;
            height: 100%;
        }

        .el-header {
            background-color: #545c64;
        }

        .header-img {
            width: 200px;
            margin-top: 20px;
            font-size: 25px;
            color: #ffffff;
        }

        .header-time {
            width: 200px;
            margin-left: 100px;
            font-size: 15px;
            color: #ffffff;
        }
    </style>

</head>
<body>
<div id="div">
    <el-container>
        <!-- 头部-->
        <el-header class="el-header">
            <el-container>
                <div style="padding-top: 10px">
                    <span class="header-img">疫情防控管理系统</span>
                </div>
                <div style="padding-top: 20px">
                    <span class="header-time">现在时间：<i id="timer" style="font-size: 13px"></i></span>
                </div>
                <div style="margin-top: 20px">
                    <span class="header-time">
                        <el-tag effect="plain" :key="admin.adminRole">尊敬的{{ admin.adminRole }}管理员,您好！</el-tag>
                    </span>
                </div>
                <el-menu
                        mode="horizontal"
                        background-color="#545c64"
                        text-color="white"
                        active-text-color="#ffd04b"
                        style="margin-left: auto;">
                    <el-menu-item index="1"><a href="index.html" target="_self">首页</a></el-menu-item>
                    <el-menu-item index="3" @click="logout" >退出登录</el-menu-item>
                </el-menu>
            </el-container>
        </el-header>

        <!-- 中间部分 -->
        <el-container style="height:870px; border: 1px solid #eee">
            <!-- 侧边栏 -->
            <el-aside width="220px" style="background-color: rgb(238, 241, 246)">
                <el-menu>
                    <el-submenu index="1" v-if="admin.adminRole=='超级'">
                        <template slot="title"><i class="el-icon-menu"></i>账户管理</template>
                        <el-menu-item-group>
                            <el-menu-item index="1-1" @click="showAdmin"><i class="el-icon-help"></i>管理员账户</el-menu-item>
                            <el-menu-item index="1-2" @click="showTeacher"><i class="el-icon-help"></i>教职工账户</el-menu-item>
                            <el-menu-item index="1-3" @click="showStudent"><i class="el-icon-help"></i>学生账户</el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>
                    <el-submenu index="2" v-if="admin.adminRole=='超级'">
                        <template slot="title"><i class="el-icon-menu"></i>校务管理</template>
                        <el-menu-item-group>
                            <el-menu-item index="2-1" @click="showFaculty"><i class="el-icon-help"></i>学院管理
                            </el-menu-item>
                            <el-menu-item index="2-2" @click="showClasses"><i class="el-icon-help"></i>班级管理
                            </el-menu-item>
                            <el-menu-item index="2-3" @click="showTeacherInfo"><i class="el-icon-help"></i>教职工信息
                            </el-menu-item>
                            <el-menu-item index="2-4" @click="showStudentInfo"><i class="el-icon-help"></i>学生信息
                            </el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>
                    <el-submenu index="3">
                        <template slot="title"><i class="el-icon-menu"></i>疫情防控管理</template>
                        <el-menu-item-group>
                            <el-menu-item index="3-1" @click="clockDaily"><i class="el-icon-help"></i>每日打卡</el-menu-item>
                            <el-menu-item index="3-2" @click="nucleicAcid"><i class="el-icon-help"></i>核酸检测</el-menu-item>
                            <el-menu-item index="3-3" @click="vaccinate"><i class="el-icon-help"></i>疫苗接种</el-menu-item>
                            <el-menu-item index="3-4" @click="registration"><i class="el-icon-help"></i>校门管理</el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>
                </el-menu>
            </el-aside>

            <el-container>
                <!-- 主区域部分 -->
                <el-main>
                    <iframe :src="iframeSrc" frameborder="false"
                            style="top:80px;left: 120px; width: 100%;height:800px"></iframe>
                </el-main>
            </el-container>
        </el-container>

    </el-container>
</div>
</body>
<script>
    new Vue({
        el: "#div",
        data: {
            iframeSrc: "manager.html",
            admin: {}
        },
        methods: {
            getAdmin() {
                axios.post("/EpidemicControlSystem_war_exploded/AdminServlet", "action=admin")
                    .then(res => {
                        this.admin = res.data;
                        console.log(this.admin);
                    });
            },
            showAdmin: function () {
                this.iframeSrc = "showAdmin.html";
            },
            showTeacher: function () {
                this.iframeSrc = "showTeacher.html";
            },
            showStudent: function () {
                this.iframeSrc = "showStudent.html";
            },
            showFaculty: function () {
                this.iframeSrc = "showFaculty.html";
            },
            showClasses: function () {
                this.iframeSrc = "showClasses.html";
            },
            showTeacherInfo: function () {
                this.iframeSrc = "showTeacherInfo.html";
            },
            showStudentInfo: function () {
                this.iframeSrc = "showStudentInfo.html";
            },
            clockDaily: function () {
                this.iframeSrc = "show_clock_daily.html";
            },
            nucleicAcid: function () {
                this.iframeSrc = "showAllNucleicAcid.html";
            },
            vaccinate: function () {
                this.iframeSrc = "showAllVaccinate.html";
            },
            registration: function () {
                this.iframeSrc = "showOutAndAudit.html";
            },



            logout: function () {
                axios.post("/EpidemicControlSystem_war_exploded/AdminServlet", "action=adminLogout")
                .then( rsp =>{
                    if (rsp.data == true){
                        alert('退出成功');
                        window.open('../login.jsp','_self');
                    }
                })
            }
        },
        mounted:function () {   //自动触发写入的函数
            this.getAdmin();
        }
    });
</script>
</html>